﻿@page
@model FormModel
<page-header title="基础表单">
    将一个冗长或用户不熟悉的表单任务分成多个步骤，指导用户完成。
</page-header>
<util-card show-border="false">
    <util-form id="form" label-span="3" control-span="15" gutter="16">
        <util-textbox for="Name"></util-textbox>
        <util-textbox for="Age"></util-textbox>
        <util-tree-select label-text="下拉树" url="/api/tree" expand-all="true" span="4"></util-tree-select>
        <util-select label-text="分组下拉" url="/api/form/groupItems" multiple="true" span="4"></util-select>
        <util-select label-text="远程加载下拉" url="/api/application/items" sort="name" server-search="true" scroll-load="true" span="4"></util-select>
        <util-select for="Nation" span="8" tags="true"></util-select>
        <util-date-picker for="DateTime"></util-date-picker>
        <util-radio for="Gender"></util-radio>
        <util-checkbox-group for="Code" data="Gender"></util-checkbox-group>
        <util-checkbox for="Enabled"></util-checkbox>
        <util-switch for="Enabled"></util-switch>
        <util-textarea for="Comment"></util-textarea>
        <util-form-item>
            <util-form-label for="Files"></util-form-label>
            <util-upload for="Files" url="/api/upload" data="data" list-type="PictureCard"></util-upload>
        </util-form-item>
        <util-form-item>
            <util-form-label for="Color"></util-form-label>
            <util-color-picker for="Color" />
            {{model.color}}
        </util-form-item>
        <util-form-item>
            <util-form-control offset="2">
                <util-button class="mr-sm" id="btnSubmit" validate-form="true" on-click="submit(form,btnSubmit)" color="Primary" icon="Check"></util-button>
                <util-button on-click="test()" text="弹出层测试" icon="Eye"></util-button>
            </util-form-control>
        </util-form-item>
    </util-form>
</util-card>